<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2021/12/20
  Time: 10:36
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>课程列表</title>
    <link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/static/easyui/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/static/easyui/themes/icon.css">
    <link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/static/easyui/css/demo.css">
    <script type="text/javascript" src="<%=request.getContextPath()%>/static/easyui/jquery.min.js"></script>
    <script type="text/javascript" src="<%=request.getContextPath()%>/static/easyui/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="<%=request.getContextPath()%>/static/easyui/js/validateExtends.js"></script>
    <script type="text/javascript">
        $(function () {
//datagrid初始化
            $('#dataList').datagrid({
                title: '课程列表',
                iconCls: 'icon-more',//图标
                border: true,
                collapsible: false,//是否可折叠的
                fit: true,//自动大小
                method: "get",
                url: "/sm/CourseListServlet?action=CourseList",
                idField: 'cid',
                singleSelect: true,//是否单选
                pagination: false,//分页控件
                rownumbers: true,//行号
                sortName: 'cid',
                sortOrder: 'DESC',
                remoteSort: false, //远程排序，点一下标题栏，重新获取排序返回数据
                columns: [[
                    {field: 'chk', checkbox: true, width: 50},
                    {field: 'cid', title: '课程编号', width: 80, sortable: true},
                    {field: 'courseName', title: '课程名称', width: 200},
                ]],
                toolbar: "#toolbar"
            });

//设置工具类按钮
            $("#add").click(function () {
                $("#addDialog").dialog("open");
            });
//删除
            $("#delete").click(function () {
                var selectRow = $("#dataList").datagrid("getSelected");
                if (selectRow == null) {
                    $.messager.alert("消息提醒", "请选择数据进行删除!", "warning");
                } else {
                    var courseid = selectRow.cid;
                    $.messager.confirm("消息提醒", "将删除与课程相关的所有数据，确认继续？", function (r) {
                        if (r) {
                            $.ajax({
                                type: "delete",
                                url: "/sm/CourseListServlet?cid="+courseid,
                                success: function (msg) {
                                    if (msg.status == 200) {
                                        $.messager.alert("消息提醒", msg.msg, "info");
                                        alert("aaa");
//刷新表格
                                        $("#dataList").datagrid("reload");
                                    } else {
                                        $.messager.alert("消息提醒", msg.msg, "warning");
                                        return;
                                    }
                                }
                            });
                        }
                    });
                }
            });

//设置添加窗口
            $("#addDialog").dialog({
                title: "添加课程",
                width: 450,
                height: 250,
                iconCls: "icon-add",
                modal: true,
                collapsible: true,
                minimizable: true,
                maximizable: true,
                draggable: true,
                closed: true,
                buttons: [
                    {
                        text: '添加',
                        plain: true,
                        iconCls: 'icon-book-add',
                        handler: function () {
                            var validate = $("#addForm").form("validate");
                            if (!validate) {
                                $.messager.alert("消息提醒", "请检查你输入的数据!", "warning");
                                return;
                            } else {
                                let data = {courseName:$("#courseName").val()}
                                $.ajax({
                                    type: "post",
                                    url: "/sm/CourseListServlet",
                                    data: JSON.stringify(data),
                                    success: function (msg) {
                                        if (msg.status == "200") {
                                            $.messager.alert("消息提醒", "添加成功!", "info");
//关闭窗口
                                            $("#addDialog").dialog("close");
//清空原表格数据
                                            $("#add_name").textbox('setValue', "");
//刷新
                                            $('#dataList').datagrid("reload");
                                        } else {
                                            $.messager.alert("消息提醒", "添加失败!", "warning");
                                            return;
                                        }
                                    }
                                });
                            }
                        }
                    },
                    {
                        text: '重置',
                        plain: true,
                        iconCls: 'icon-book-reset',
                        handler: function () {
                            $("#add_name").textbox('setValue', "");
                        }
                    },
                ]
            });

        });
    </script>
</head>
<body>
<!-- 数据列表 -->
<table id="dataList" cellspacing="0" cellpadding="0">

</table>
<!-- 工具栏 -->
<div id="toolbar">
    <div style="float: left;"><a id="add" href="javascript:;" class="easyui-linkbutton"
                                 data-options="iconCls:'icon-add',plain:true">添加</a></div>
    <div style="float: left;" class="datagrid-btn-separator"></div>
    <div><a id="delete" href="javascript:;" class="easyui-linkbutton"
            data-options="iconCls:'icon-some-delete',plain:true">删除</a></div>
</div>

<!-- 添加数据窗口 -->
<div id="addDialog" style="padding: 10px">
    <form id="addForm" method="post">
        <table cellpadding="8">
            <tr>
                <td>课程名称:</td>
                <td><input id="courseName" style="width: 200px; height: 30px;" class="easyui-textbox" type="text"
                           name="name" data-options="required:true, validType:'repeat_course', missingMessage:'不能为空'"/>
                </td>
            </tr>
        </table>
    </form>
</div>
</body>
</html>
